<template>
  <div class="production-record">
    <page>
      <div slot="top">
        <el-form label-width="100px" size="small" :inline="true">
          <el-form-item label="生产批次号">
            <el-input class="query-item" v-model="queryParmars.batchCode" placeholder="请输入" />
          </el-form-item>
          <el-form-item label="生产单编号">
            <el-input class="query-item" v-model="queryParmars.taskCode" placeholder="请输入" />
          </el-form-item>
          <el-form-item label="产品编码">
            <el-input class="query-item" v-model="queryParmars.prodCode" placeholder="请输入" />
          </el-form-item>
          <el-form-item label="所属隧道">
            <el-input class="query-item" v-model="queryParmars.tunnel" placeholder="请输入" />
            <!-- <el-select placeholder="请选择"  class="query-item">
              <el-option
                v-for="item in tunnelOptions"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              >
              </el-option>
            </el-select> -->
          </el-form-item>
          <el-form-item label="隧道部位">
            <el-select placeholder="请选择" v-model="queryParmars.tunnelArea" class="query-item">
              <el-option
                v-for="item in tunnelPartsOptions"
                :key="item.id"
                :label="item.dictLabel"
                :value="item.dictValue"
              >
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="工字钢类型">
            <el-input class="query-item" v-model="queryParmars.steel" placeholder="请输入" />
            <!-- <el-select placeholder="请选择" v-model="queryParmars.tunnelArea" class="query-item">
              <el-option
                v-for="item in steelOptions"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              >
              </el-option>
            </el-select> -->
          </el-form-item>
          <el-form-item label="单元">
            <el-select placeholder="请选择" v-model="queryParmars.unit" class="query-item">
              <el-option
                v-for="item in unitOptions"
                :key="item.id"
                :label="item.dictLabel"
                :value="item.dictValue"
              >
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item class="btn-query-item">
            <el-button type="primary" @click="getTableData()">查询</el-button>
            <el-button @click="reset">重置</el-button>
          </el-form-item>
        </el-form>
      </div>
      <div slot="body">
        <el-table :data="tableData" border>
          <el-table-column
            align="center"
            label="序号"
            width="50px"
            type="index"
          ></el-table-column>
          <el-table-column
            align="center"
            prop="batchCode"
            show-overflow-tooltip
            width="150px"
            label="生产批次号"
          ></el-table-column>
          <el-table-column
            align="center"
            show-overflow-tooltip
            width="150px"
            prop="taskCode"
            label="生产单编号"
          ></el-table-column>
          <el-table-column
            align="center"
            show-overflow-tooltip
            width="150px"
            prop="prodCode"
            label="产品编码"
          ></el-table-column>
          <el-table-column
            align="center"
            show-overflow-tooltip
            width="150px"
            prop="tunnel"
            label="所属隧道"
          ></el-table-column>
          <el-table-column
            align="center"
            width="120px"
            prop="tunnelArea"
            label="隧道部位"
          >
          <template slot-scope="scope">
            <span>{{
              (tunnelPartsOptions.find(item => item.dictValue == scope.row.tunnelArea) || {}).dictLabel ||
              scope.row.tunnelArea
            }}</span>
          </template>
        </el-table-column>
          <el-table-column
            align="center"
            width="100px"
            prop="steel"
            label="工字钢类型"
          ></el-table-column>
          <el-table-column
            align="center"
            width="100px"
            prop="unit"
            label="单元"
          >
          <template slot-scope="scope">
            <span>{{
              (unitOptions.find(item => item.dictValue == scope.row.unit) || {}).dictLabel ||
              scope.row.unit
            }}</span>
          </template>
          </el-table-column>
          <el-table-column
            align="center"
            width="100px"
            prop="finishNum"
            label="产量"
          ></el-table-column>
          <el-table-column align="center" label="批次设计冷弯数据">
            <el-table-column
              align="center"
              width="100px"
              prop="lwXc"
              label="弦长"
            ></el-table-column>
            <el-table-column
              align="center"
              width="100px"
              prop="lwHc"
              label="弧长"
            ></el-table-column>
            <el-table-column
              align="center"
              width="100px"
              prop="lwDjjl"
              label="顶进距离"
            ></el-table-column>
          </el-table-column>
          <el-table-column align="center" label="批次实际切割数据">
            <el-table-column
              align="center"
              width="100px"
              prop="qgXzcd"
              label="行走长度"
            ></el-table-column>
            <el-table-column
              align="center"
              width="100px"
              prop="qgSc"
              label="时长"
            ></el-table-column>
            <el-table-column
              align="center"
              width="100px"
              prop="qgJgpc"
              label="激光偏差"
            ></el-table-column>
          </el-table-column>
          <el-table-column align="center" label="批次实际焊接数据">
            <el-table-column
              align="center"
              width="100px"
              prop="hjSj2d"
              label="2D数据"
            ></el-table-column>
            <el-table-column
              align="center"
              width="100px"
              prop="hjJgpc"
              label="激光偏差"
            ></el-table-column>
            <el-table-column
              align="center"
              width="100px"
              prop="hjPbsl"
              label="配板数量"
            ></el-table-column>
            <el-table-column
              align="center"
              width="100px"
              prop="hjSc"
              label="时长"
            ></el-table-column>
          </el-table-column>
          <el-table-column align="center" label="批次实际数据复合">
            <el-table-column
              align="center"
              width="100px"
              prop="fhNql"
              label="扭曲量"
            ></el-table-column>
            <el-table-column
              align="center"
              width="100px"
              prop="fhHtl"
              label="回弹量"
            ></el-table-column>
          </el-table-column>
          <el-table-column align="center" label="批次实际成品质量">
            <el-table-column
              align="center"
              width="100px"
              prop="zlHjzl"
              label="焊接质量"
            ></el-table-column>
            <el-table-column
              align="center"
              width="100px"
              prop="zlPbjd"
              label="配板精度"
            ></el-table-column>
          </el-table-column>
          <el-table-column
            align="center"
            width="100px"
            prop="operator"
            label="操作员"
          ></el-table-column>
          <el-table-column
            align="center"
            width="250px"
            prop="madeDate"
            label="生产日期"
          ></el-table-column>
        </el-table>
      </div>
      <div slot="footer">
        <el-pagination
          background
          :page-size="pageVO.pageSize"
          :current-page.sync="pageVO.pageNum"
          :total="pageVO.total"
          :layout="pageOptions.layout"
          :page-sizes="pageOptions.pageSizes"
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
        />
      </div>
    </page>
  </div>
</template>
<script>
import {getList,getDicts} from '@/api/records'
import pageQuery from "../../mixins/pageQuery";
export default {
  mixins: [pageQuery],
  data() {
    return {
      queryParmars:{
        taskCode:''
      },
      pageVO:{
        total: 0,
        pageNum: 1,
        pageSize: 10,
      },
      tunnelOptions: [{ label: "隧道", value: "1" }],
      tunnelPartsOptions: [],
      steelOptions: [{ label: "工字钢类型", value: "1" }],
      unitOptions: [],
      open:false
    };
  },
  created() {
    this.queryParmars.taskCode = this.$route.query?.taskCode || '';
    this.getTableData(1)
    getDicts({dictType:'sys_tunnel_area'}).then(res=>{
      this.tunnelPartsOptions=res.data.data
    })
    getDicts({dictType:'sys_prod_unit'}).then(res=>{
      this.unitOptions=res.data.data
    })
  },
  methods: {
    getTableData() {
      const parmas={
        ...this.queryParmars
      }
      parmas.pageNo=this.pageVO.pageNum;
      parmas.pageSize=this.pageVO.pageSize
      getList(parmas).then(res=>{
        this.tableData=res.data.data;
        this.pageVO.total=res.data.total;
      })
    },
    reset(){
      this.queryParmars={}
    }
  },
};
</script>
<style lang="scss" scoped>
.production-record {
  .btn-query-item {
    margin-left: 30px;
  }
}
</style>
